import React,{useState,useMemo} from 'react'

export default function LayOut() {
    const [count,setCount] = useState(0)
    const [list] = useState([1,2,3])
    function renderList(){
        console.log("renderlist");
        return list.map((item,index)=><li key={index}>{item}</li>)
    }
    const memoList = useMemo(()=>renderList(),[list])
    return (
        <div>
            <button onClick={()=>{setCount(preCount=>preCount+1)}}>+</button>
            <p>{count}</p> 
            <ul>
                {memoList}
            </ul>
        </div>
    )
}
